<template>
  <div class="common-layout">
    <HeaderCom></HeaderCom>
    <article>
      <AsideCom></AsideCom>
      <section>
        <RouterView />
      </section>
    </article>
  </div>
</template>

<script setup name="home">
import { ref, reactive } from "vue";
import HeaderCom from '@/components/HeaderCom.vue';
import AsideCom from '@/components/AsideCom.vue';
</script>

<style lang="less" scoped>
.common-layout {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  article {
    flex: 1;
    display: flex;
  }
  section {
    flex: 1;
    background-color: rgba(243, 245, 246, 0.89);
    overflow: hidden;
  }
}
</style>
